import { createApp } from 'vue'
import pinia from './stores'
import ElementPlus from 'element-plus'
import zhCn from 'element-plus/es/locale/lang/zh-cn'
import 'element-plus/dist/index.css'
import App from './App.vue'
import router from './router'
import './styles/index.scss'
import ElSvg from './components/SvgIcon/ElSvg'
import './permission'

const app = createApp(App)
import CategorySelector from '@/components/CategorySelector/index.vue'
app.component('CategorySelector',CategorySelector)


ElSvg(app)

app.use(pinia)
  .use(router)
  .use(ElementPlus, {
    locale: zhCn,
  })
  .mount('#app')


  
import { useUserInfoStore } from '@/stores/userInfo'
const userInfoStore = useUserInfoStore(); // 拿到userinfoStore
app.directive('permissionBtn', (el, binding) => {
  // binding.value // 指令绑定的值
  // userInfoStore.userinfo.buttons // store中当前用户的 按钮权限数据
  if ( !userInfoStore.userinfo.buttons.includes(binding.value) ) { // 如果按钮权限中不包含这个权限值的时候,隐藏掉el即可
    el.parentNode?.removeChild(el); // 拿到当前元素的父元素,删除掉当前元素即可
  }
})
